import {
  ActionType,
  ModalForm,
  PageContainer,
  ProColumns,
  ProFormDigit,
  ProFormSelect,
  ProFormTextArea,
  ProTable
} from "@ant-design/pro-components";
import {Button, Form, Tooltip} from "antd";
import React, {useRef, useState} from "react";
import {AccountBookOutlined, CheckOutlined, CloseOutlined, SettingFilled} from "@ant-design/icons";
import {globalApi, globalLoadTableApiCode, handleGloblApi} from "@/services/admin-api/globalApi";
import {useAccess} from "umi";

export type WorkerWalletRecord = {
  wwrId: number;
  workerId: number;
  workerNickName: string
  orderId: number;
  wwrType: number;
  wwrDesc: string
  beforeMoney: number;
  changeMoney: number;
  afterMoney: number;
  ocId: number;
  delFlag: boolean;
  createTime: string;
  createUserId: number;
  createUserName: string;
  updateTime: string;
  updateUserId: number;
  updateUserName: string;

  wwrStatus: number

  accountTime: string
  accountType: number
  accountUserName: string
  accountUserId: number
  accountRemark: string

  passUserName: string
  passUserId: number
  passTime: string
  passRemark: string

  rejectUserName: string
  rejectUserId: number
  rejectTime: string
  rejectRemark: string

};

export const wwrType = await globalApi('/config/dict', {key: 'wwr_type'})
export const wwrStatus = await globalApi('/config/dict', {key: 'wwr_status'})
export const accountType = await globalApi('/config/dict', {key: 'account_type'})

export default () => {
  const access = useAccess()

  const [modalOpen, handleModalOpen] = useState(false);
  const [modalAccountOpen, handleAccountModalOpen] = useState(false);
  const [form] = Form.useForm();
  const [formAccount] = Form.useForm();
  const actionRef = useRef<ActionType>();

  const columns: ProColumns<WorkerWalletRecord>[] = [
    // {title: '', valueType: 'indexBorder'},
    {title: '记录ID', dataIndex: 'wwrId', valueType: 'digit'},
    {title: '服务人员ID', dataIndex: 'workerId', valueType: 'digit', hideInSearch: true,},
    {title: '服务人员', dataIndex: 'workerNickName', valueType: 'text', hideInSearch: true,},
    {title: '订单ID', dataIndex: 'orderId', valueType: 'text', hideInSearch: true,},
    {
      title: '记录类型',
      dataIndex: 'wwrType',
      valueType: 'select',
      fieldProps: {options: wwrType.data}
    },
    {title: '记录描述', dataIndex: 'wwrDesc', valueType: 'text', hideInSearch: true,},
    {title: '变更前', dataIndex: 'beforeMoney', valueType: 'money', hideInSearch: true,},
    {title: '变更金额', dataIndex: 'changeMoney', valueType: 'money', hideInSearch: true,},
    {title: '变更后', dataIndex: 'afterMoney', valueType: 'money', hideInSearch: true,},
    {title: '成本ID', dataIndex: 'ocId', valueType: 'digit', hideInSearch: true,},
    {
      title: '记录状态',
      dataIndex: 'wwrStatus',
      valueType: 'select',
      fieldProps: {options: wwrStatus.data}
    },
    {title: '到账时间', dataIndex: 'accountTime', valueType: 'dateTime', hideInSearch: true,},
    {title: '到账类型', dataIndex: 'accountType', valueType: 'select', fieldProps: {options: accountType.data}},
    {title: '到账用户', dataIndex: 'accountUserName', valueType: 'text', hideInSearch: true,},
    {title: '到账用户ID', dataIndex: 'accountUserId', valueType: 'digit', hideInSearch: true,},
    {title: '到账备注', dataIndex: 'accountRemark', valueType: 'text', hideInSearch: true,},
    {title: '通过用户', dataIndex: 'passUserName', valueType: 'text', hideInSearch: true,},
    {title: '通过用户ID', dataIndex: 'passUserId', valueType: 'digit', hideInSearch: true,},
    {title: '通过时间', dataIndex: 'passTime', valueType: 'dateTime', hideInSearch: true,},
    {title: '通过备注', dataIndex: 'passRemark', valueType: 'text', hideInSearch: true,},
    {title: '拒绝用户', dataIndex: 'rejectUserName', valueType: 'text', hideInSearch: true,},
    {title: '拒绝用户ID', dataIndex: 'rejectUserId', valueType: 'digit', hideInSearch: true,},
    {title: '拒绝时间', dataIndex: 'rejectTime', valueType: 'dateTime', hideInSearch: true,},
    {title: '拒绝备注', dataIndex: 'rejectRemark', valueType: 'text', hideInSearch: true,},
    {title: '创建时间', dataIndex: 'createTime', valueType: 'dateTime', hideInSearch: true,},
    {title: '创建用户ID', dataIndex: 'createUserId', valueType: 'digit', hideInSearch: true,},
    {title: '创建用户', dataIndex: 'createUserName', valueType: 'text', hideInSearch: true,},
    {title: '更新时间', dataIndex: 'updateTime', valueType: 'dateTime', hideInSearch: true,},
    {title: '更新用户ID', dataIndex: 'updateUserId', valueType: 'digit', hideInSearch: true,},
    {title: '更新用户', dataIndex: 'updateUserName', valueType: 'text', hideInSearch: true,},
    {
      title: <SettingFilled/>,
      render: (_, record) => [
        record.wwrStatus === 0 && record.wwrType === 5 ?
          <Tooltip key={'edit_' + record.wwrId} title={"审核"}>
            <Button
              size="small" icon={<CheckOutlined/>} type="primary"
              onClick={async () => {
                form.setFieldsValue({wwrId: record.wwrId});
                handleModalOpen(true);
              }}
            />
          </Tooltip> : ''
        ,
        record.wwrStatus === 1 && !record.accountTime ?
          <Tooltip key={'account_' + record.wwrId} title={"到账"}>
            <Button
              size="small" icon={<AccountBookOutlined/>} type="primary"
              onClick={async () => {
                formAccount.setFieldsValue({wwrId: record.wwrId});
                handleAccountModalOpen(true);
              }}
            />
          </Tooltip> : ''
        ,
        record.wwrStatus === 1 && !record.accountTime ?
          <Tooltip key={'reject_' + record.wwrId} title={"驳回"}>
            <Button
              size="small" danger icon={<CloseOutlined/>} type="primary"
              onClick={async () => {
                form.setFieldsValue({wwrId: record.wwrId, wwrStatus: 2});
                handleModalOpen(true);
              }}
            />
          </Tooltip> : ''
        ,
      ],
      valueType: 'option',
    },
  ];

  return <PageContainer header={{title: '', breadcrumb: {},}}>
    <ProTable<WorkerWalletRecord>
      columns={columns} actionRef={actionRef} search={{span: 4}} size={"small"}
      request={async (param) => globalLoadTableApiCode('/finance/workerWallteRecordTable', 'worker:walletLog:list:search', access, param)}
      rowKey={(record) => record.wwrId}
      columnsState={{
        defaultValue: {
          delFlag: {show: false},
          createUserId: {show: false},
          updateUserId: {show: false},
          workerId: {show: false},
          rejectUserId: {show: false},
          passUserId: {show: false},
          accountUserId: {show: false},
        }
      }}/>

    <ModalForm
      modalProps={{destroyOnClose: true}} autoFocusFirstInput submitTimeout={15000}
      width="400px" open={modalOpen} onOpenChange={handleModalOpen} form={form}
      onFinish={async (value) => {
        console.log('value = ', value);
        let success = await handleGloblApi('/finance/checkWorkerWithdraw', value)

        if (success) {
          actionRef.current?.reload();
          return true
        }
      }}
    >
      <ProFormDigit name="wwrId" hidden/>
      <ProFormSelect
        label={"状态"} rules={[{required: true}]} name={"wwrStatus"}
        options={[{label: '通过', value: 1}, {label: '驳回', value: 2}]}/>
      <ProFormTextArea label="备注" rules={[{required: true}]} name="remark"/>
    </ModalForm>

    <ModalForm
      modalProps={{destroyOnClose: true}} autoFocusFirstInput submitTimeout={15000}
      width="400px" open={modalAccountOpen} onOpenChange={handleAccountModalOpen} form={formAccount}
      onFinish={async (value) => {
        console.log('value = ', value);
        let success = await handleGloblApi('/finance/accountWorkerWithdraw', value)

        if (success) {
          actionRef.current?.reload();
          return true
        }
      }}
    >
      <ProFormDigit name="wwrId" hidden/>
      <ProFormSelect
        label={"到账类型"} rules={[{required: true}]} name={"accountType"}
        options={accountType.data}/>
      <ProFormTextArea label="备注" rules={[{required: true}]} name="accountRemark"/>
    </ModalForm>

  </PageContainer>
}
